<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>餐馆增加</title>
<base href="<%=basePath%>">
<link rel="stylesheet" type="text/css"
	href="<%=basePath%>res/tl/js/layui/css/layui.css" media="all">
<style type="text/css">
	body{
		margin:20px 0px;
	}
</style>
</head>
<body>
	<fieldset class="layui-elem-field layui-field-title"
		style="margin-top: 20px;">
		<legend>修改地址</legend>
	</fieldset>

	<form class="layui-form" action="<%=basePath%>shArea/update" method="post">
		<input type="hidden" id="addressId" name="addressId">
		<div class="layui-form-item">
			<label class="layui-form-label">收货地址(新或旧)</label>
			<div class="layui-input-inline">
				<input type="text" disabled
					 placeholder="旧收货地址" autocomplete="off"
					maxlength="10" class="layui-input merchantSite">
					<input type="hidden" name="addressContent" class="merchantSite">
			</div>
		</div>
		<div class="layui-form-item">
			<div class="layui-inline">
				<label class="layui-form-label">收货地址</label>
				<div class="layui-input-inline">
					<select name="quiz1" lay-filter="business" id="quiz1">
						<option value="">请选择省(非必填)</option>
					</select>
				</div>
				<div class="layui-input-inline">
					<select name="quiz2" lay-filter="business" id="quiz2">
						<option value="">请选择市(非必填)</option>
					</select>
				</div>
				<div class="layui-input-inline">
					<select name="quiz3" lay-filter="business" id="quiz3">
						<option value="">请选择县/区(非必填)</option>
					</select>
				</div>
			</div>
		</div>
		<div class="layui-form-item">
			<label class="layui-form-label">详细地址</label>
			<div class="layui-input-block">
				<textarea placeholder="请输入内容" class="layui-textarea" name="addressDetails" id="addressDetails"></textarea>
			</div>
		</div>
		
		<div class="layui-form-item">
			<div class="layui-input-block">
				<input type="submit" class="layui-btn" lay-submit=""
					lay-filter="Add" value="立即修改" >
				<button type="reset" class="layui-btn layui-btn-primary">重置</button>
			</div>
		</div>
	</form>
	<script src="<%=basePath%>res/tl/js/layui/layui.js" charset="utf-8"></script>
	<script src="<%=basePath%>js/jquery-1.10.2.js" charset="utf-8"></script>
	<script type="text/javascript">
		layui.use('form', function(){
			  var form = layui.form
			  ,layer = layui.layer
			  ,$ = layui.$;
			  
			  
			 form.on('submit(Add)',function(){
				  var index = parent.layer.getFrameIndex(window.name);
				  parent.layer.close(index);
			  }); 
			  var quiz1 = "";
			  var quiz2 = "";
			  var quiz3 = "";
			  var selectName = "";
			  form.on('select(business)', function(data){
				  selectName = $(data.elem).attr("name");
				  if(selectName == "quiz1"){
					  quiz1 = data.value;
					  $("#quiz2").html("");
					  $("#quiz2").html("<option value=''>请选择市(非必填)</option>")
				  }else if(selectName == "quiz2"){
					  quiz2 = data.value;
					  $("#quiz3").html("");
					  $("#quiz3").html("<option value=''>请选择县/区(非必填)</option>")
				  }else if(selectName == "quiz3"){
					  quiz3 = data.value;
					  $(".merchantSite").val(quiz1+"-"+quiz2+"-"+quiz3);
				  }
				  var data = {"areaPid":data.value,"selectName":selectName}
				  showArea(data);
			});
			  
		var data = {"areaPid":"0","selectName":selectName}
		showArea(data);
		
	});
		
		//重新渲染表单
		function renderForm(){
		  layui.use('form', function(){
		   var form = layui.form;//高版本建议把括号去掉，有的低版本，需要加()
		   form.render();
		  });
		 }
		
		function showArea(data){
			var url = "<%=basePath %>fodArea/findByPid";
			$.ajax({
				url:url,
				data:{"areaPid":data.areaPid},
				success:function(msg){
					for(var i=0;i<msg.length;i++){
						if(data.selectName != ""){
							if(data.selectName == "quiz1"){
								$("#quiz2").append("<option value="+msg[i].areaName+">"+msg[i].areaName+"</option>");
							}else if(data.selectName == "quiz2"){
								$("#quiz3").append("<option value="+msg[i].areaName+">"+msg[i].areaName+"</option>");
							}
							
						}else {
							$("#quiz1").append("<option value="+msg[i].areaName+">"+msg[i].areaName+"</option>");
						}
						
					}
					renderForm();//下拉菜单渲染 把内容加载进去
				}
			});
		}
	</script>
</body>
</html>